<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>修改姓名</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <script src="js/rem.js"></script> 
    <script src="js/jquery.min.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="css/base.css"/>
    <link rel="stylesheet" type="text/css" href="css/page.css"/>
    <link rel="stylesheet" type="text/css" href="css/all.css"/>
    <link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/loaders.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/loading.css"/>
    <link rel="stylesheet" type="text/css" href="slick/slick.css"/>
    <link rel="stylesheet" type="text/css" href="css/mui.picker.min.css" />
	<link href="css/mui.picker.css" rel="stylesheet" />
<script type="text/javascript">
	$(window).load(function(){
		$(".loading").addClass("loader-chanage")
		$(".loading").fadeOut(300)
	})
</script>
</head>
<!--loading页开始-->
<div class="loading">
	<div class="loader">
        <div class="loader-inner pacman">
          <div></div>
          <div></div>
          <div></div>
          <div></div>
          <div></div>
        </div>
	</div>
</div>
<!--loading页结束-->
	<body>
		<!--header star-->
		<header class="mui-bar mui-bar1 mui-bar-nav mui-bar-nav1" id="header">
			<a class="btn" href="javascript:history.go(-1)">
	            <i class="iconfont icon-fanhui"></i>
	        </a>
	        <div class="top-sch-box top-sch-boxtwo top-sch-boxthree flex-col">
	                      返回
	        </div>
	    </header>
	    <!--header end-->
	    
	    <div class="warp warpthree clearfloat">
	    	<div class="h-top h-toptwo clearfloat box-s">
	    		<p class="tu"><img src="img/touxiang.png"/></p>
	    		<p class="nr" id='username'><span>普通会员</span></p>
	    	</div>
			<form>
	    	<div class="apply recharge clearfloat">
	    		<div class="appxiugai clearfloat">
	    			<ul>
						
	    				<li class="ra3 fl">
	    					<i class="iconfont icon-iconfontxingming fl"></i>
	    					<input type="text" name="phone" id="phone" value="" placeholder="手机号" />
	    				</li>
						
						<li class="ra3 fl">
							<i class="iconfont icon-iconfontxingming fl"></i>
							<input type="text" name="idcard" id="idcard" value="" placeholder="证件号" />
						</li>
	    			</ul>
	    		</div> 
	    		<div class="xia clearfloat">
	    			<a href="#" class="db fl btn ra3" id='btnSubmit'>确定</a>
	    			<a href="center.html" class="db fr btn ra3">取消</a>
	    		</div>
	    	</div>    	
	    </div>
	    </form>
	    <!--footer star-->
	    <footer class="page-footer fixed-footer" id="footer">
			<ul>
				<li>
					<a href="index.html">
						<i class="iconfont icon-shouye"></i>
						<p>商城</p>
					</a>
				</li>
				<li>
					<a href="#">
						<i class="iconfont icon-erweima1"></i>
						<p>二维码</p>
					</a>
				</li>
				<li>
					<a href="#">
						<i class="iconfont icon-kefu1"></i>
						<p>客服</p>
					</a>
				</li>
				<li class="active">
					<a href="login.html">
						<i class="iconfont icon-yonghuming"></i>
						<p>我的</p>
					</a>
				</li>
			</ul>
		</footer>
		<!--footer end-->
	</body>
	<script type="text/javascript" src="js/jquery-1.8.3.min.js" ></script>
	<script src="js/mui.min.js"></script>
	<script src="js/mui.picker.min.js"></script>
	<!-- <script src="js/others.js"></script> -->
	<script type="text/javascript" src="js/hmt.js" ></script>
	<script src="slick/slick.js" type="text/javascript" ></script>
	<!--插件-->
	<link rel="stylesheet" href="css/swiper.min.css">
	<script src="js/swiper.jquery.min.js"></script>
	<script type="text/javascript" src="./js/validate.js"></script>
			<script type="text/javascript">
				var findInfoUrl=baseUrl+ "/zuul-user/users/findUserInfo";
				var changeInfoUrl=baseUrl+ "/zuul-user/users/changeUserInfo";
				var oldParams={};
	
				$(function(){ // 页面就绪事件
					// 发送AJAX请求，获取用户信息
	$.get(findInfoUrl,{'uid':localStorage.getItem('uid')} , function(result){
		var userInfo=result.data;
						// 回填表单数据
						$("#username").html(userInfo.username);
						if(userInfo.phone==null){
							$("#phone").prop("placeholder","首次设置");
						}else{
							$("#phone").val(userInfo.phone);
						}
						if(userInfo.idcard==null){
							$("#idcard").prop("placeholder","首次设置");
						}else{
							$("#idcard").val(userInfo.idcard);
						}
				
						// 填充oldParams
						oldParams.phone=userInfo.phone;
						oldParams.idcard=userInfo.idcard;
						
					});
	
					// 为手机号绑定验证逻辑
	// 				$("#phone").bind("input",function(){
	
	// 				// $("#idcard").bind("input",function(){
	// 				// 	checkidcard("idcard","邮箱格式不正确");
	// 				})
	
					// 为提交按钮添加点击事件
					$("#btnSubmit").click(function(){
						
						// checkPhone("phone","请输入正确的手机号");
					
						// 获取表单数据
						// var username=$("#username").val();
						var phone=$("#phone").val();
						var idcard=$("#idcard").val();
						

						//没有更新则不提交
						if(oldParams.phone==phone && oldParams.idcard==idcard){
							alert("本次未更新任何内容");
							return;
						}
	
						// 两次密码一致
						var flag=checkPhone("phone","请输入正确的手机号");
						// flag=checkidcard("idcard","邮箱格式不正确")&&flag;
						
	
						// 有验证异常则不提交表单
						// if(flag==false){
						// 	return;
						// }
	
						// 提交表单
						var params={
							username:localStorage.getItem('username'),
							uid:localStorage.getItem('uid'),
							phone:phone,
							idcard:idcard
					
						}
						// 发送AJAX请求
						$.post(changeInfoUrl,params,function(result){
							// 处理响应数据
							if(result.state==1000){ // 正常响应
								alert("信息修改成功");
							}else{ // 异常响应
								alert(result.msg);
							}
						});
					});
				});
			</script>
	
</html>
